<template>
  <div>
    <button @click="gotoHome">跳转到首页</button>
    <button @click="gotoAbout">跳转传参</button>
  </div>
</template>
<script>
import { useRouter } from "vue-router";
export default {
  setup(props) {
    const router = useRouter();
    //创建一个useRouter的实例就相当于是 this.$router实例
    const gotoHome = () => {
      router.push("/");
    };

    const gotoAbout = () => {
      router.push({ path: "/about", query: { id: 5 } });
      //   router.push({ name: "About", params: { id: 5 } });
      //   router.push("/about/" + 5);
    };
    //路由传参有三种传参方法：
    // query和params 还有动态路由传参

    return { gotoHome, gotoAbout };
  },
};
</script>
